<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Amber - Pet Care Bootstrap 5 Template</title>

    <!-- Favicons -->
    <link rel="shortcut icon" href="assets/images/favicon.ico">

    <link rel="stylesheet" href="assets/css/vendor/vendor.min.css">
    <link rel="stylesheet" href="assets/css/plugins/plugins.min.css">
    <link rel="stylesheet" href="assets/css/style.min.css">




</head>

<body style="font-family: 'Britannic Bold'">
    <div id="app">
        <!-- Header Section Start -->
        <div class="header section">

            <!-- Header Bottom Start -->
            <div class="header-bottom">
                <div class="header-sticky">
                    <div class="container">
                        <div class="row align-items-center position-relative">

                            <!-- Header Logo Start -->
                            <div class="col-lg-3 col-md-4 col-6">
                                <div class="header-logo">
                                    <a href="index.html"><img src="assets/images/logo/logo.png" alt="Site Logo" /></a>
                                </div>
                            </div>
                            <!-- Header Logo End -->

                            <!-- Header Menu Start -->
                            <div class="col-lg-6 d-none d-lg-block">
                                <div class="main-menu">
                                    <ul>
                                        <li><a href="index.html">首页</a></li>
                                        <li><a href="shop.html">商品列表</a></li>
                                        <li><a href="cart.html">购物车</a></li>
                                        <li><a href="about.html">关于</a></li>
                                        <li><a href="../login.html">退出登录</a></li>
                                    </ul>
                                </div>
                            </div>
                            <!-- Header Menu End -->

                            <!-- Header Action Start -->
                            <div class="col-lg-3 col-md-8 col-6">
                                <div class="header-actions">

                                    <!-- Header Action Search Button Start -->
                                    <div class="header-action-btn header-action-btn-search d-none d-md-flex">
                                        <div class="action-execute">
                                            <a class="action-search-open" href="javascript:void(0)"><i
                                                    class="icon-magnifier icons"></i></a>
                                            <a class="action-search-close" href="javascript:void(0)"><i
                                                    class="ti-close"></i></a>
                                        </div>
                                        <!-- Search Form and Button Start -->
                                        <form class="header-search-form" action="#">
                                            <input type="text" class="header-search-input"
                                                placeholder="Search Our Store">
                                            <button class="header-search-button"><i
                                                    class="icon-magnifier icons"></i></button>
                                        </form>
                                        <!-- Search Form and Button End -->
                                    </div>
                                    <!-- Header Action Search Button End -->

                                    <!-- Header My Account Button Start -->
                                    <a href="my-account.html" class="header-action-btn header-action-btn-wishlist">
                                        <i class="icon-user icons"></i>
                                    </a>
                                    <!-- Header My Account Button End -->

                                    <!-- Header Action Button Start -->
                                    <div class="header-action-btn header-action-btn-cart d-none d-sm-flex">
                                        <a class="cart-visible" href="javascript:void(0)"
                                            @click="()=>{$('.header-cart-content').slideToggle('slow');}">
                                            <i class="icon-handbag icons"></i>
                                            <span class="header-action-num">{{cartNum}}</span>
                                        </a>

                                        <!-- Header Cart Content Start -->
                                        <div class="header-cart-content" id="carts">

                                            <!-- Cart Procut Wrapper Start  -->
                                            <div class="cart-product-wrapper">

                                                <!-- Cart Product/Price Start -->
                                                <div class="cart-product-inner p-b-20 m-b-20 border-bottom"
                                                    v-for="(item,index) in cartList" :key="index">

                                                    <!-- Single Cart Product Start -->
                                                    <div class="single-cart-product">
                                                        <div class="cart-product-thumb">
                                                            <a href="#"><img :src="item.images" alt="Cart Product"></a>
                                                        </div>
                                                        <div class="cart-product-content">
                                                            <h3 class="title"><a href="#">{{item.shopName}}</a></h3>
                                                            <div class="product-quty-price">
                                                                <span class="cart-quantity">数量: <strong> {{item.number}}
                                                                    </strong></span>
                                                                <span class="price">
                                                                    <span class="new">￥{{item.money}}</span>
                                                                </span>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <!-- Single Cart Product End -->

                                                    <!-- Product Remove Start -->
                                                    <div class="cart-product-remove">
                                                        <a href="#/" @click="delCart(item.id)"><i
                                                                class="icon-close"></i></a>
                                                    </div>
                                                    <!-- Product Remove End -->

                                                </div>
                                                <!-- Cart Product/Price End -->

                                            </div>
                                            <!-- Cart Procut Wrapper -->

                                            <!-- Cart Product Total Start -->
                                            <div class="cart-product-total p-b-20 m-b-20 border-bottom">
                                                <span class="value">总价</span>
                                                <span class="price">￥{{countMoney}}</span>
                                            </div>
                                            <!-- Cart Product Total End -->

                                            <!-- Cart Product Button Start -->
                                            <div class="cart-product-btn m-t-20">
                                                <a href="cart.html"
                                                    class="btn btn-outline-light btn-hover-primary w-100">查看购物车</a>
                                                <a href="#" class="btn btn-outline-light btn-hover-primary w-100 m-t-20"
                                                    @click="buyAll">全部下单</a>
                                            </div>
                                            <!-- Cart Product Button End -->

                                        </div>
                                        <!-- Header Cart Content End -->

                                    </div>
                                    <div class="header-action-btn header-action-btn-cart d-flex d-sm-none">
                                        <a href="#">
                                            <i class="icon-handbag icons"></i>
                                            <span class="header-action-num">3</span>
                                        </a>
                                    </div>
                                    <!-- Header Action Button End -->

                                    <!-- Mobile Menu Hambarger Action Button Start -->
                                    <a href="javascript:void(0)"
                                        class="header-action-btn header-action-btn-menu d-lg-none d-md-flex">
                                        <i class="icon-menu"></i>
                                    </a>
                                    <!-- Mobile Menu Hambarger Action Button End -->

                                </div>
                            </div>
                            <!-- Header Action End -->

                        </div>
                    </div>
                </div>
            </div>
            <!-- Header Bottom End -->

        </div>
        <!-- Header Section End -->

        <!-- Breadcrumb Area Start -->
        <div class="section breadcrumb-area bg-name-bright">
            <div class="container">
                <div class="row">
                    <div class="col-12 text-center">
                        <div class="breadcrumb-wrapper">
                            <h2 class="breadcrumb-title">商品列表</h2>
                            <ul>
                                <li><a href="index.html">首页</a></li>
                                <li>商品列表</li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Breadcrumb Area End -->

        <!-- Shop Section Start -->
        <div class="section section-margin">
            <div class="container">
                <div class="row">
                    <div class="col-12">

                        <!--shop toolbar start-->
                        <div class="shop_toolbar_wrapper flex-column flex-md-row p-2 m-b-40 border">

                            <!-- Shop Top Bar Left start -->
                            <div class="shop-top-bar-left">

                                <div class="shop_toolbar_btn">
                                    <button data-role="grid_4" type="button" class="active btn-grid-4" title="Grid"><i
                                            class="ti-layout-grid4-alt"></i></button>
                                    <button data-role="grid_list" type="button" class="btn-list" title="List"><i
                                            class="ti-align-justify"></i></button>
                                </div>

                            </div>
                            <!-- Shop Top Bar Left end -->

                            <!-- Shopt Top Bar Right Start -->
                            <div class="shop-top-bar-right">

                                <h4 class="title m-r-10">商品类型: </h4>

                                <div class="shop-short-by" style="margin-right: 10px;">
                                    <select class="nice-select" v-model="oneClassification" aria-label=".form-select-sm example">
                                        <option disabled selected value="">请选择大类</option>
                                        <option value="狗狗专区">狗狗专区</option>
                                        <option value="猫咪专区">猫咪专区</option>
                                        <option value="鸟儿专区">鸟儿专区</option>
                                        <option value="龟、鱼专区">龟、鱼专区</option>
                                        <option value="鼠类专区">鼠类专区</option>
                                        <option value="兔子专区">兔子专区</option>
                                    </select>
                                </div>
                                <div class="shop-short-by" style="margin-right: 10px;">
                                    <select class="nice-select" v-model="twoClassification" aria-label=".form-select-sm example">
                                        <option disabled selected value="">请选择二类</option>
                                        <option value="零食">零食</option>
                                        <option value="调养药品">调养药品</option>
                                        <option value="服装装饰">服装装饰</option>
                                        <option value="毛发护理">毛发护理</option>
                                        <option value="洗护清洁">洗护清洁</option>
                                        <option value="生活用品">生活用品</option>
                                        <option value="玩具">玩具</option>
                                        <option value="宠物笼子">宠物笼子</option>
                                    </select>
                                </div>
                                <div class="shop-short-by">
                                    <button type="button" style="font-size: 15px;border: 0;color: #000000;" @click="reset">重置</button>
                                    <button type="button" style="font-size: 15px;background-color: #f6ab49;border: 0;color: #FFFFFF;" @click="getList">查询</button>
                                </div>
                            </div>
                            <!-- Shopt Top Bar Right End -->

                        </div>
                        <!--shop toolbar end-->

                        <!-- Shop Wrapper Start -->
                        <div class="row shop_wrapper grid_4">

                            <!-- Single Product Start -->
                            <div class="col-xl-3 col-lg-4 col-md-4 col-sm-6 product" v-for="(item,index) in selectList"
                                :key="index">
                                <div class="product-inner">
                                    <div class="thumb">
                                        <a href="#" class="image">
                                            <img class="fit-image" :src="item.images" alt="Product" />
                                        </a>
                                        <div class="action-wrapper">
                                            <a href="#/" class="action quickview" data-bs-toggle="modal"
                                                data-bs-target="#quick-view" title="Quickview"><i
                                                    class="ti-plus" @click="getGoodsDetail(item.id)"></i></a>
                                            <a href="#" class="action wishlist" data-bs-toggle="modal"
                                               data-bs-target="#message" title="Wishlist" @click="getMessageList(item.id)"><i
                                                    class="ti-comment-alt"></i></a>
                                            <a href="#" class="action cart" title="Cart"><i
                                                    class="ti-shopping-cart" @click="addCart(item.id,item.salePrice)"></i></a>
                                        </div>
                                    </div>
                                    <div class="content">
                                        <h5 class="title"><a href="#">{{item.shopName}}</a></h5>
                                        <span class="rating">
                                            <i class="fa fa-star-o"></i>
                                            <i class="fa fa-star-o"></i>
                                            <i class="fa fa-star-o"></i>
                                            <i class="fa fa-star-o"></i>
                                            <i class="fa fa-star-o"></i>
                                        </span>
                                        <span class="price">
                                            <span class="new">￥{{item.salePrice}}</span>
                                        </span>
                                        <!-- Cart Button Start -->
                                        <div class="cart-btn action-btn">
                                            <div class="action-cart-btn-wrapper d-flex">
                                                <div class="add-to_cart">
                                                    <a class="btn btn-primary btn-hover-dark rounded-0" href="#"
                                                        @click="addCart(item.id,item.salePrice)">添加到购物车</a>
                                                </div>
                                                <a href="#" title="Wishlist" class="action"><i class="ti-heart"></i></a>
                                                <a href="#/" class="action quickview" data-bs-toggle="modal"
                                                    data-bs-target="#quick-view" title="Quickview"
                                                    @click="getGoodsDetail(item.id)"><i class="ti-plus"></i></a>
                                            </div>
                                        </div>
                                        <!-- Cart Button End -->
                                    </div>
                                </div>
                            </div>
                            <!-- Single Product End -->

                        </div>
                        <!-- Shop Wrapper End -->

                    </div>
                </div>
            </div>
        </div>
        <!-- Shop Section End -->

        <!-- Footer Section Start -->
        <footer class="section footer-section" style="margin-top: 800px;">

            <!-- Footer Bottom Start -->
            <div class="footer-bottom bg-name-light p-t-20 p-b-20">
                <div class="container">
                    <div class="row align-items-center m-b-n20">
                        <div class="col-md-6 text-center text-md-start order-2 order-md-1 m-b-20">
                            <div class="copyright-content">
                                <p class="mb-0">Copyright &copy; 2022.XXX.</p>
                            </div>
                        </div>
                        <div class="col-md-6 text-center text-md-end order-1 order-md-2 m-b-20">
                            <div class="payment">
                                <a href="#/">
                                    <img class="fit-image" src="assets/images/payment/payment_large.png" alt="Payment">
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- Footer Bottom End -->
        </footer>
        <!-- Footer Section End -->

        <!-- Modal Start  -->
        <div class="modalquickview modal fade" id="quick-view" tabindex="-1" aria-labelledby="quick-view" role="dialog"
            aria-hidden="true">
            <div class="modal-dialog modal-dialog-centered">
                <div class="modal-content">
                    <button class="btn close" data-bs-dismiss="modal">×</button>
                    <div class="row">
                        <div class="col-md-6 col-12">

                            <!-- Product Details Image Start -->
                            <div class="modal-product-carousel">

                                <!-- Single Product Image Start -->
                                <div class="swiper-container">
                                    <div class="swiper-wrapper">
                                        <a class="swiper-slide" href="#">
                                            <img class="w-100" :src="editForm.images" alt="Product">
                                        </a>
                                    </div>
                                </div>
                                <!-- Single Product Image End -->

                            </div>
                            <!-- Product Details Image End -->

                        </div>
                        <div class="col-md-6 col-12 overflow-hidden position-relative">

                            <!-- Product Summery Start -->
                            <div class="product-summery position-relative">

                                <!-- Product Head Start -->
                                <div class="product-head m-b-15">
                                    <h2 class="product-title">{{editForm.shopName}}</h2>
                                </div>
                                <!-- Product Head End -->

                                <!-- Rating Start -->
                                <span class="rating justify-content-start m-b-10">
                                    <i class="fa fa-star"></i>
                                    <i class="fa fa-star"></i>
                                    <i class="fa fa-star"></i>
                                    <i class="fa fa-star-half-o"></i>
                                    <i class="fa fa-star-o"></i>
                                </span>
                                <!-- Rating End -->

                                <!-- Price Box Start -->
                                <div class="price-box m-b-10">
                                    <span class="regular-price">￥{{editForm.salePrice}}</span>
                                </div>
                                <!-- Price Box End -->

                                <!-- SKU Start -->
                                <div class="sku m-b-15">
                                    <span>ID: {{editForm.id}}</span>
                                </div>
                                <!-- SKU End -->

                                <!-- Quantity Start -->
                                <div class="quantity d-flex align-items-center justify-content-start m-b-25">
                                    <span class="m-r-10"><strong>数量: </strong></span>
                                    <input class="cart-plus-minus-box" v-model="detailNum" type="text">
                                </div>
                                <!-- Quantity End -->

                                <!-- Cart Button Start -->
                                <div class="cart-btn action-btn m-b-30">
                                    <div class="action-cart-btn-wrapper d-flex justify-content-start">
                                        <div class="add-to_cart">
                                            <a class="btn btn-primary btn-hover-dark rounded-0" href="#"
                                                @click="addCart(editForm.id,editForm.salePrice)">添加到购物车</a>
                                        </div>
<!--                                        <a href="#" title="Wishlist" class="action"><i class="ti-heart"></i></a>-->
                                    </div>
                                </div>
                                <!-- Cart Button End -->

                                <!-- Social Shear Start -->
<!--                                <div class="social-share">-->
<!--                                    <div class="widget-social justify-content-center m-b-30">-->
<!--                                        <a title="Twitter" href="#/"><i class="icon-social-twitter"></i></a>-->
<!--                                        <a title="Instagram" href="#/"><i class="icon-social-instagram"></i></a>-->
<!--                                        <a title="Linkedin" href="#/"><i class="icon-social-linkedin"></i></a>-->
<!--                                        <a title="Skype" href="#/"><i class="icon-social-skype"></i></a>-->
<!--                                        <a title="Dribble" href="#/"><i class="icon-social-dribbble"></i></a>-->
<!--                                    </div>-->
<!--                                </div>-->
<!--                                &lt;!&ndash; Social Shear End &ndash;&gt;-->

<!--                                &lt;!&ndash; Payment Option Start &ndash;&gt;-->
<!--                                <div class="payment-option m-t-20 d-flex justify-content-start">-->
<!--                                    <span><strong>Payment: </strong></span>-->
<!--                                    <a href="#">-->
<!--                                        <img class="fit-image m-l-5" src="assets/images/payment/payment_large.png"-->
<!--                                            alt="Payment Option Image">-->
<!--                                    </a>-->
<!--                                </div>-->
                                <!-- Payment Option End -->

                            </div>
                            <!-- Product Summery End -->

                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Modal End  -->
        <!-- Modal Start  -->
        <div class="modalquickview modal fade" id="message" tabindex="-1" aria-labelledby="quick-view" role="dialog"
             aria-hidden="true">
            <div class="modal-dialog modal-dialog-centered">
                <div class="modal-content" style="width: 600px;">
                    <button class="btn close" data-bs-dismiss="modal">×</button>
                    <div class="row">
                        <div class="col-24 overflow-hidden position-relative">

                            <!-- Product Summery Start -->
                            <div class="product-summery position-relative">

                                <!-- Product Head Start -->
                                <div class="product-head m-b-15">
                                    <h2 class="product-title">商品留言</h2>
                                </div>
                                <!-- Product Head End -->

                                <div class="message" style="height: 300px;overflow-x: hidden;overflow-y: scroll;">
                                    <div class="price-box m-b-10" v-for="(item,index) in messageList" :key="index">
                                        <span class="regular-price">{{item.account}}：{{item.massageText}}</span>
                                    </div>
                                </div>

                                <!-- Quantity Start -->
                                <div class="quantity d-flex align-items-center justify-content-start m-b-25" style="margin: 25px 0 5px 0;">
                                    <span class="regular-price"><strong>留言内容: </strong></span>
                                </div>
                                <div class="quantity d-flex align-items-center justify-content-start m-b-25">
                                    <textarea class="form-control" v-model="massageText"></textarea>
                                </div>
                                <!-- Quantity End -->
                                <!-- Cart Button Start -->
                                <div class="cart-btn action-btn m-b-30">
                                    <div class="action-cart-btn-wrapper d-flex justify-content-start">
                                        <div class="add-to_cart">
                                            <a class="btn btn-primary btn-hover-dark rounded-0" data-bs-dismiss="modal" href="#"
                                               @click="insertMessage(shopId)">发布评论</a>
                                        </div>
                                    </div>
                                </div>
                                <!-- Cart Button End -->

                            </div>
                            <!-- Product Summery End -->
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Modal End  -->
    </div>
    <!-- Mobile Menu End -->

    <!-- Use the minified version files listed below for better performance and remove the files listed above -->

    <script src="assets/js/vendor.min.js"></script>
    <script src="assets/js/plugins.min.js"></script>

    <!--Main JS-->
    <script src="assets/js/main.js"></script>
    <script src="assets/js/vue.min.js"></script>
    <script>
        new Vue({
            el: '#app',
            data: function () {
                return {
                    userId: '',
                    userName: '',
                    role: '',
                    isVip: '',
                    address: '',
                    selectList: [],
                    cartList: [],
                    messageList:[],
                    page: 1,
                    size:9999999,
                    shopName: '',
                    cartNum: 0,
                    countMoney: 0,
                    oneClassification: '',
                    twoClassification: '',
                    editForm: {
                        id: null,
                        oneClassification: '',
                        twoClassification: '',
                        shopName: '',
                        sale_price: 0,
                        purchasePrice: null,
                        salePrice: null,
                        numberCount: null,
                        images: ''
                    },
                    detailNum: 1,
                    shopId:'',
                    massageText:''
                }
            },
            mounted() {
                var userInfo = JSON.parse(sessionStorage.getItem('userInfo'));
                if (userInfo == "" || userInfo == null) {
                    alert("您还没有登录，请先登录后在进行操作！");
                    window.location.href = '../login.html'
                };
                this.userName = userInfo.account
                this.role = userInfo.role
                this.userId = userInfo.id
                this.getUserInfo()
                this.getList()
                this.getCartList()
                $('.shop_toolbar_btn > button').on('click', function (e) {

                    e.preventDefault();

                    $('.shop_toolbar_btn > button').removeClass('active');
                    $(this).addClass('active');

                    var parentsDiv = $('.shop_wrapper');
                    var viewMode = $(this).data('role');


                    parentsDiv.removeClass('grid_3 grid_4 grid_5 grid_list').addClass(viewMode);

                    if(viewMode == 'grid_3'){
                        parentsDiv.children().addClass('col-lg-4 col-md-4 col-sm-6').removeClass('col-lg-3 col-cust-5 col-12');

                    }

                    if(viewMode == 'grid_4'){
                        parentsDiv.children().addClass('col-xl-3 col-lg-4 col-md-4 col-sm-6').removeClass('col-lg-4 col-cust-5 col-12');
                    }

                    if(viewMode == 'grid_list'){
                        parentsDiv.children().addClass('col-12').removeClass('col-xl-3 col-lg-3 col-lg-4 col-md-6 col-md-4 col-sm-6 col-cust-5');
                    }

                });
            },
            methods: {
                getUserInfo(){
                    const that = this
                    $.ajax({
                        //几个参数需要注意一下
                        type: "POST", //方法类型
                        dataType: "json", //预期服务器返回的数据类型
                        contentType: 'application/json',
                        url: "/userInfo/queryById",
                        data: JSON.stringify({
                            id: that.userId
                        }),
                        success: function (data) {
                            that.isVip = data.vip
                            that.address = data.address
                        },
                        error: function () {
                            alert("异常！");
                        }
                    });
                },
                getList() {
                    const that = this
                    $.ajax({
                        //几个参数需要注意一下
                        type: "POST", //方法类型
                        dataType: "json", //预期服务器返回的数据类型
                        url: "/shop/queryByPage",
                        contentType: 'application/json',
                        data: JSON.stringify({
                            "size": that.size,
                            "page": that.page,
                            "shopName": that.shopName,
                            "oneClassification": that.oneClassification,
                            "twoClassification": that.twoClassification
                        }),
                        success: function (data) {
                            that.selectList = data.data.list
                        },
                        error: function () {
                            alert("异常！");
                        }
                    });
                },
                reset(){
                    this.oneClassification = ''
                    this.twoClassification = ''
                },
                getGoodsDetail(id) {
                    const that = this
                    $.ajax({
                        //几个参数需要注意一下
                        type: "POST", //方法类型
                        dataType: "json", //预期服务器返回的数据类型
                        contentType: 'application/json',
                        url: "/shop/queryById",
                        data: JSON.stringify({
                            id: id
                        }),
                        success: function (data) {
                            that.editForm = data
                        },
                        error: function () {
                            alert("异常！");
                        }
                    });
                },
                getCartList() {
                    const that = this
                    that.countMoney = 0
                    $.ajax({
                        //几个参数需要注意一下
                        type: "POST", //方法类型
                        dataType: "json", //预期服务器返回的数据类型
                        url: "/orderList/list",
                        contentType: 'application/json',
                        data: JSON.stringify({
                            "size": that.size,
                            "page": that.page,
                            "shopState": '0',
                            "bugId": that.userId
                        }),
                        success: function (data) {
                            data.data.list.forEach((item) => {
                                that.countMoney += item.money
                            })
                            that.cartList = data.data.list
                            that.cartNum = data.data.total
                        },
                        error: function () {
                            alert("异常！");
                        }
                    });
                },
                addCart(id, salePrice) {
                    const that = this
                    if (confirm("确定要加入购物车吗?")) {
                        if(that.isVip === '1'){
                            salePrice = salePrice * 0.8
                        }
                        $.ajax({
                            //几个参数需要注意一下
                            type: "POST", //方法类型
                            dataType: "json", //预期服务器返回的数据类型
                            contentType: 'application/json',
                            url: "/orderList/add",
                            data: JSON.stringify({
                                shopId: id,
                                number: that.detailNum,
                                shopState: '0',
                                bugId: that.userId,
                                money: that.detailNum * salePrice,
                                getAddress: that.address
                            }),
                            success: function (data) {
                                alert("添加成功！");
                                that.getCartList()
                                that.detailNum = 1
                            },
                            error: function () {
                                alert("异常！");
                            }
                        });
                    }
                },
                buyAll() {
                    const that = this
                    if (confirm("确定要全部下单吗?")) {
                        that.cartList.forEach((item) => {
                            $.ajax({
                                //几个参数需要注意一下
                                type: "POST", //方法类型
                                dataType: "json", //预期服务器返回的数据类型
                                contentType: 'application/json',
                                url: "/orderList/edit",
                                data: JSON.stringify({
                                    id: item.id,
                                    shopState: '1'
                                }),
                                success: function (data) {
                                    that.getCartList()
                                },
                                error: function () {
                                    alert("异常！");
                                }
                            });
                        })
                    }
                },
                delCart(id) {
                    const that = this
                    $.ajax({
                        //几个参数需要注意一下
                        type: "POST", //方法类型
                        dataType: "json", //预期服务器返回的数据类型
                        contentType: 'application/json',
                        url: "/orderList/deleteById",
                        data: JSON.stringify({
                            id: id
                        }),
                        success: function (data) {
                            that.getCartList()
                        },
                        error: function () {
                            alert("异常！");
                        }
                    });
                },
                getMessageList(shopId){
                    const that = this
                    that.shopId = shopId
                    $.ajax({
                        //几个参数需要注意一下
                        type: "POST", //方法类型
                        dataType: "json", //预期服务器返回的数据类型
                        contentType: 'application/json',
                        url: "/shopMassage/queryByPage",
                        data: JSON.stringify({
                            "size": that.size,
                            "page": that.page,
                            "shopId": shopId
                        }),
                        success: function (data) {
                            that.messageList = data.data.list
                        },
                        error: function () {
                            alert("异常！");
                        }
                    });
                },
                insertMessage(shopId){
                    const that = this
                    $.ajax({
                        //几个参数需要注意一下
                        type: "POST", //方法类型
                        dataType: "json", //预期服务器返回的数据类型
                        contentType: 'application/json',
                        url: "/shopMassage/add",
                        data: JSON.stringify({
                            shopId: shopId,
                            massageText: that.massageText,
                            userId: that.userId,
                            type:'0'
                        }),
                        success: function (data) {
                            alert("发布成功")
                            that.getMessageList()
                            that.massageText = ''
                        },
                        error: function () {
                            alert("异常！");
                        }
                    });
                }
            }
        })
    </script>
</body>

</html>
